import React, { Component } from 'react'
import "./Index.less"
import { Switch, Route, NavLink } from "react-router-dom"

import home_y from "../../assets/img/home_y.jpeg"
import home_n from "../../assets/img/home_n.jpeg"
import cate_y from "../../assets/img/cate_y.jpeg"
import cate_n from "../../assets/img/cate_n.jpeg"
import mine_y from "../../assets/img/mine_y.jpeg"
import mine_n from "../../assets/img/mine_n.jpeg"
import shop_y from "../../assets/img/shop_y.jpeg"
import shop_n from "../../assets/img/shop_n.jpeg"

import Home from "../Home/Home"
import Cate from "../Cate/Cate"
import Shop from "../Shop/Shop"
import Mine from "../Mine/Mine"
export default class Index extends Component {
    
    render() {
        console.log(this.props);
        return (
            <div className="index">
                {/* 二级路由导航 */}
                <Switch>
                    <Route path="/index/home" component={Home}></Route>
                    <Route path="/index/cate" component={Cate}></Route>
                    <Route path="/index/shop" component={Shop}></Route>
                    <Route path="/index/Mine" component={Mine}></Route>
                </Switch>

                <footer className="footer">
                    <NavLink to="/index/home">
                        <img src={true ? home_y : home_n} alt="" />
                        <div>首页</div>
                    </NavLink >
                    <NavLink to="/index/cate">
                        <img src={true ? cate_y : cate_n} alt="" />
                        <div>分类</div>
                    </NavLink >
                    <NavLink to="/index/shop">
                        <img src={true ? shop_y : shop_n} alt="" />
                        <div>商城</div>
                    </NavLink >
                    <NavLink to="/index/Mine">
                        <img src={true ? mine_y : mine_n} alt="" />
                        <div>我的</div>
                    </NavLink >
                </footer>
            </div>
        )
    }
}
